<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<meta name="viewport" content="width=device-width, initial-scale=1.0" />
		<title>后台管理界面</title>
		
		<link rel="stylesheet" href="css/administrator.css" />
		<link rel="stylesheet" href="css/font-awesome.min.css" />
	</head>

	<body>
		<div id="wrapper">
			<nav id="left_nav">
				<div>
					<ul>
						<li class="nav_header">
							<div class="profile_element">
								<span><img src="img/avatar.jpg" class="ads_img" /></span>
								<div id="nav_header_menu" class="nav_header_menu collapse_parent">
									<p class="ads_name">行船全靠浪</p>
									<p class="ads_rank collapse_button">超级管理员<span class="collapse_logo"><i class="fa fa-chevron-up" aria-hidden="true"></i></span></p>
									<ul id="ads_menu" class="ads_menu collapse_menu">
										<li>
											<a href="#">修改头像</a>
										</li>
										<li>
											<a href="#">个人资料</a>
										</li>
										<li>
											<a href="#">联系我们</a>
										</li>
										<li>
											<a href="#">信箱</a>
										</li>
										<li class="ads_menu_divider"></li>
										<li>
											<a href="#">安全退出</a>
										</li>

									</ul>
								</div>
							</div>
						</li>
						<li class="nav_li collapse_parent">
							<a class="nav_collapse_a  collapse_button"><span class="nav_collapse_a_logo"><i class="fa fa-home" aria-hidden="true"></i></span>主页
								<span class="collapse_logo f_r"><i class="fa fa-chevron-up" aria-hidden="true"></i></span>
							</a>
							<div class="nav_collapse_menu collapse_menu">
								<ul>
									<li>
										<a href="#">主页示例一</a>
									</li>
									<li>
										<a href="#">主页示例二</a>
									</li>
									<li>
										<a href="#">主页示例三</a>
									</li>
									<li>
										<a href="#">主页示例四</a>
									</li>
									<li>
										<a href="#">主页示例五</a>
									</li>
								</ul>
							</div>
						</li>
						<li class="nav_li collapse_parent">
							<a class="nav_collapse_a collapse_button">
								<span class="nav_collapse_a_logo "><i class="fa fa-home" aria-hidden="true"></i></span>主页
								<span class="collapse_logo f_r"><i class="fa fa-chevron-up" aria-hidden="true"></i></span>
							</a>
							<div class="nav_collapse_menu collapse_menu">
								<ul>
									<li>
										<a href="#">主页示例一</a>
									</li>
									<li>
										<a href="#">主页示例二</a>
									</li>
									<li>
										<a href="#">主页示例三</a>
									</li>
									<li>
										<a href="#">主页示例四</a>
									</li>
									<li>
										<a href="#">主页示例五</a>
									</li>
								</ul>
							</div>
						</li>
					</ul>
				</div>
			</nav>
			<div id="right_content">
				<div class="right_content_top">
					<div>
						<span class="nav_collapse_span"><i class="fa fa-bars" aria-hidden="true"></i></span>
						<input class="top_search_input" type="text" placeholder="请输入你要查找的内容" />
					</div>
					<nav class="top_nav f_r">
						<ul>
							<li>
								<a href="#"><i class="fa fa-commenting-o" aria-hidden="true"></i></a>
							</li>
							<li>
								<a href="#"><i class="fa fa-paper-plane" aria-hidden="true"></i> </a>
							</li>
						</ul>
					</nav>
				</div>
				<nav class="right_nav">
					<button class="f_l"><i class="fa fa-backward" aria-hidden="true"></i></button>

					<div class="f_r">
						<button class="f_l menu_forward_button"><i class="fa fa-forward" aria-hidden="true"></i> </button>
						<div class="f_l menu_close_button_parent collapse_parent">
							<button class="menu_close_button collapse_button">关闭操作<span class="collapse_logo"><i class="fa fa-chevron-up" aria-hidden="true"></i></span>  </button>
							<ul class="close_menu collapse_menu">
								<li>
									<a href="#">关闭当前选项卡</a>
								</li>
								<li class="close_menu_divider"></li>
								<li>
									<a href="#">关闭全部选项卡</a>
								</li>
								<li>
									<a href="#">关闭其他选项卡</a>
								</li>
							</ul>
						</div>
						<button class="f_l menu_sign-out_button"><i class="fa fa-sign-out" aria-hidden="true"></i>退出</button>
					</div>
					<ul class="right_nav_menu">
						<li>
							<a href="#">首页</a>
						</li>
						<li class="right_nav_menu_li">
							<a href="#">案例一</a>
							<span class="right_nav_menu_li_close"><i class="fa fa-times-circle" aria-hidden="true"></i> </span>
						</li>

					</ul>
				</nav>
				<div id="main_content">
					<div class="row">
						<div class="zyq-md-3">
							<div class="current_message collapse_parent">
								<h4 class="zyq-gray-h4">最新动态
							
							<span class="f_r current_message_close"><i class="fa fa-times-circle" aria-hidden="true"></i> </span>
							<span class="f_r collapse_button collapse_logo"><i class="fa fa-chevron-up" aria-hidden="true"></i></span>
							</h4>
								<ul class="current_message_ul collapse_menu">
									<li>
										<a href="#" class="current_message_name">
											#行船全靠浪#
										</a>
										<span class="current_message_content">
									感谢你们的一路相伴,未来也请让我为你们撑腰，我们会更好。
								</span>
										<p><i class="fa fa-clock-o" aria-hidden="true"></i><span class="current_message_time">1分钟前</span>
											<span class="current_message_origin f_r">生活如此多娇</span>
											<i class="f_r">From&nbsp;:&nbsp;&nbsp;</i>
										</p>
									</li>
									<li>
										<a href="#" class="current_message_name">
											#行船全靠浪#
										</a>
										<span class="current_message_content">
									感谢你们的一路相伴,未来也请让我为你们撑腰，我们会更好。
								</span>
										<p><i class="fa fa-clock-o" aria-hidden="true"></i><span class="current_message_time">1分钟前</span>
											<span class="current_message_origin f_r">生活如此多娇</span>
											<i class="f_r">From&nbsp;:&nbsp;&nbsp;</i>
										</p>
									</li>
									<li>
										<a href="#" class="current_message_name">
											#行船全靠浪#
										</a>
										<span class="current_message_content">
									感谢你们的一路相伴,未来也请让我为你们撑腰，我们会更好。
								</span>
										<p><i class="fa fa-clock-o" aria-hidden="true"></i><span class="current_message_time">1分钟前</span>
											<span class="current_message_origin f_r">生活如此多娇</span>
											<i class="f_r">From&nbsp;:&nbsp;&nbsp;</i>
										</p>
									</li>
								</ul>
							</div>
						</div>
						<div class="zyq-md-3">
							<div class="current_news collapse_parent">
								<h4 class="zyq-gray-h4">最新动态							
								<span class="f_r current_news_close"><i class="fa fa-times-circle" aria-hidden="true"></i> </span>
								<span class="f_r collapse_button collapse_logo"><i class="fa fa-chevron-up" aria-hidden="true"></i></span>
							</h4>
								<div class="collapse_menu">
									<ul class="current_news_ul">
										<li>
											<a href="#" class="f_l">
												<img src="img/avatar.jpg" class="current_news_img" />
											</a>
											<div>
												<span class="current_news_name">
											爱三国，爱生活
										</span>
												<span class="current_news_content">
											征战四方，勇夺临江城主.
											征战四方，勇夺临江城主.
											征战四方，勇夺临江城主.
										</span>
												<p>
													<small class="current_news_date">2018.06.18</small>
													<small class="current_news_time f_r">5分钟前</small>
												</p>
											</div>
										</li>
										<li>
											<a href="#" class="f_l">
												<img src="img/avatar.jpg" class="current_news_img" />
											</a>
											<div>
												<span class="current_news_name">
											行船全靠浪
										</span>
												<span class="current_news_content">
											上传了一个文件
										</span>
												<p>
													<small class="current_news_date">2018.06.18</small>
													<small class="current_news_time f_r">5分钟前</small>
												</p>
											</div>
										</li>
										<li>
											<a href="#" class="f_l">
												<img src="img/avatar.jpg" class="current_news_img" />
											</a>
											<div>
												<span class="current_news_name">
											生活如此多娇
										</span>
												<span class="current_news_content">
											发表了一篇文章
										</span>
												<p>
													<small class="current_news_date">2018.06.18</small>
													<small class="current_news_time f_r">5分钟前</small>
												</p>
											</div>
										</li>
									</ul>
									<div class="current_news_more_parent">
										<button class="current_news_more"><i class="fa fa-arrow-down"></i>加载更多</button>
									</div>
								</div>
							</div>
						</div>
					</div>
					<div class="row">
						<div class="zyq-md-9">
							<div class="collapse_parent">
								<h4 class="data_item_h4">未命名
									<span class="f_r "><i class="fa fa-times-circle" aria-hidden="true"></i> </span>
									<span class="collapse_button collapse_logo f_r"><i class="fa fa-chevron-down"></i></span>								
								</h4>
								<div class="data_item_main collapse_menu">
									<div class="data_item_main_top">
										<label>
											每页<select class="data_item_num_select">
												<option>10</option>
												<option>20</option>
												<option>30</option>
												<option>40</option>
											</select>条记录
										</label>
										<label class="f_r">
											<span>姓名查找</span>
											<input class="data_item_name_search" type="text"/>
										</label>
									</div>
									<table>
										<thead>
											<tr>
												<th style="width: 20%;">姓名</th>
												<th style="width: 20%;">学院</th>
												<th style="width: 20%;">联系方式</th>
												<th style="width: 20%;">性别</th>
												<th style="width: 20%;">操作</th>
											</tr>
										</thead>
										<tbody>
											<tr>
												<td>张莹祺</td>
												<td>信息科学与技术学院</td>
												<td>15814516445</td>
												<td>男</td>
												<td>操作</td>
											</tr>
											<tr>
												<td>张莹祺</td>
												<td>信息科学与技术学院</td>
												<td>15814516445</td>
												<td>男</td>
												<td>操作</td>
											</tr>
											<tr>
												<td>张莹祺</td>
												<td>信息科学与技术学院</td>
												<td>15814516445</td>
												<td>男</td>
												<td>操作</td>
											</tr>
											<tr>
												<td>张莹祺</td>
												<td>信息科学与技术学院</td>
												<td>15814516445</td>
												<td>男</td>
												<td>操作</td>
											</tr>
											<tr>
												<td>张莹祺</td>
												<td>信息科学与技术学院</td>
												<td>15814516445</td>
												<td>男</td>
												<td>操作</td>
											</tr>
											<tr>
												<td>张莹祺</td>
												<td>信息科学与技术学院</td>
												<td>15814516445</td>
												<td>男</td>
												<td>操作</td>
											</tr>
											<tr>
												<td>张莹祺</td>
												<td>信息科学与技术学院</td>
												<td>15814516445</td>
												<td>男</td>
												<td>操作</td>
											</tr>
											<tr>
												<td>张莹祺</td>
												<td>信息科学与技术学院</td>
												<td>15814516445</td>
												<td>男</td>
												<td>操作</td>
											</tr>
										</tbody>
									</table>
									<div class="data_item_main_down">
										<strong>总共<span>122</span>项</strong>
										<ul>
											<li><a href="#">上一页</a></li>
											<li><a href="#">1</a></li>
											<li><a href="#">2</a></li>
											<li><a href="#">3</a></li>
											<li><a href="#">4</a></li>
											<li><a href="#">5</a></li>
											<li><a href="#">下一页</a></li>
										</ul>
									</div>
								</div>
							</div>
						</div>
					</div>
					<div class="row">
						<div class="zyq-md-3">
							<div class="personal_info">
								<div class="f_l">
									<a href="#">
										<img src="img/a2.jpg" class="personal_img" />
									</a>
									<p class="personal_job">CEO</p>
								</div>
								<div>
									<a href="#" class="personal_name">行船全靠浪</a>
									<p class="personal_ins">信息科学与技术学院</p>
									<p class="personal_tel">15814516445</p>
								</div>
							</div>
						</div>
						<div class="zyq-md-3">
							<div class="personal_info">
								<div class="f_l">
									<a href="#">
										<img src="img/a2.jpg" class="personal_img" />
									</a>
									<p class="personal_job">CEO</p>
								</div>
								<div>
									<a href="#" class="personal_name">行船全靠浪</a>
									<p class="personal_ins">信息科学与技术学院</p>
									<p class="personal_tel">15814516445</p>
								</div>
							</div>
						</div>
						<div class="zyq-md-3">
							<div class="personal_info">
								<div class="f_l">
									<a href="#">
										<img src="img/a2.jpg" class="personal_img" />
									</a>
									<p class="personal_job">CEO</p>
								</div>
								<div>
									<a href="#" class="personal_name">行船全靠浪</a>
									<p class="personal_ins">信息科学与技术学院</p>
									<p class="personal_tel">15814516445</p>
								</div>
							</div>
						</div>
					</div>
					<div class="row">
						<div class="zyq-md-6">
							<h4 class="zyq-gray-h4">公告编辑
								<span class="f_r current_news_close"><i class="fa fa-times-circle" aria-hidden="true"></i> </span>
								<span class="f_r collapse_button collapse_logo"><i class="fa fa-chevron-up" aria-hidden="true"></i></span>
							</h4>
							<div class="collapse_parent">
								
							</div>
						</div>
					</div>
				</div>

			</div>
		</div>
		<script type="text/javascript" src="js/jquery.min.js"></script>
		<script type="text/javascript" src="js/administrator.js"></script>
	</body>

</html>